<template>
	<view :class="[empty ? '' : 'padding-lr-sm']">

		<!-- 空白页 -->
		<use-empty v-if="empty" e-style="round" e-type="cart" :btn-tip="false" tip="暂无记录"></use-empty>

		<view v-else class="padding bg-main border-radius margin-top-sm pos-r" v-for="(item, idx) in datas" :key="idx">
			<view class="dflex-b ">
				<view class="dflex">
					<view class="">
						<view class="fwbd">
							{{ item.remark }}
						</view>
						<view class="fs-xxs ft-dark">
							提现金额:¥{{ item.amount }},
							实际金额:¥{{ item.arrivalAmount }}
						</view>
						<view class="fs-xxs ft-dark">
							{{ $api.format(item.createTime, 'yyyy-MM-dd hh:mm') }}
						</view>
					</view>
				</view>
				<view class="">
					<view class="fwb">提现:￥{{item.amount }}</view>
					<view class="fwb">手续费:¥{{ item.service }}</view>
				</view>
			</view>
			<view class="bg-base fs-xxs pos-a pos-top pos-right" style="border-bottom-left-radius: 20rpx; padding: 2rpx 10rpx;">
				提现金额
			</view>
		</view>
	</view>
</template>

<script>
	import {extract_page} from "../../../js_sdk/apis/user.js"
	export default {
		data() {
			return {
				empty: false,
				state: '',
				// 加载更多状态
				loadmoreType: 'more',
				// 请求数据
				reqdata: {
					current: 1,
					size: 20,
					category:null,
					type:null,
					sidx: 'sort',
					sord: 'asc'
				},
				datas: []
			};
		},
		//下拉刷新
		onPullDownRefresh() {
			this.loadData('refresh');
		},
		//加载更多
		onReachBottom() {
			this.loadData();
		},
		onLoad(options) {
			this.loadData();
		},
		methods: {
			bindDateChange(e){
				// 对应操作
				this.month=e.detail.value
				this.loadData()
			},
			// 加载商品，下拉刷新|上拉加载
			async loadData(type = 'add', loading) {

				if (this.loadmoreType === 'loading') {
					// 防止重复加载
					return;
				}

				if (loading == 1 || type == 'refresh') {
					// 从首页开始加载
					this.reqdata.current = 1;
				}

				// 没有更多直接返回
				if (type === 'add') {
					if (this.loadmoreType === 'nomore') {
						return;
					}
					// 加载中
					this.loadmoreType = 'loading';
				} else {
					// 更多
					this.loadmoreType = 'more'
				}
				extract_page(this.reqdata).then(res => {
					if (res.code === 200) {
						if (res.data.records && res.data.records.length > 0) {
							if (loading == 1 || type == 'refresh') {
								this.datas = [];
							}
							this.datas = [...this.datas, ...res.data.records];

							if (res.data.records.length >= this.reqdata.size) {
								this.reqdata.current++;
								this.loadmoreType = 'more'
							} else {
								this.loadmoreType = 'nomore'
							}
						} else {
							this.loadmoreType = 'nomore'
						}
					}

					if (this.datas.length === 0) {
						this.empty = true;
					}

					if (loading == 1) {
						uni.hideLoading()
					} else if (type == 'refresh') {
						uni.stopPullDownRefresh();
					}
				})
			}
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #f5f5f5;
	}
	/* 订单状态区 */
	.navbar-area {
		white-space: nowrap;
	}

	.state-area {
		height: 7vh;
		box-shadow: 0 1px 5px rgba(0, 0, 0, 0.06);
	}

	.nav-item {
		flex: 1;

		&.active {
			&:after {
				content: '';
				position: absolute;
				left: 50%;
				transform: translate(-50%);
				bottom: 0;
				width: 44px;
				height: 0;
				border-bottom: 2px solid $base-color;
			}
		}
	}

</style>
